<template>
  <div class="on-sale-good-car">
    <div class="search-content">
      <div class="putaway-time-wrapper">
        <span class="member_name-label">会员名称：</span>
        <el-input
          class="search-content-input"
          v-model="searchContent.mname"
          placeholder="请输入会员名称"
        ></el-input>
      </div>
      <div class="putaway-time-wrapper">
        <span class="member_name-label">添加时间：</span>
        <el-date-picker
          v-model="searchContent.arrive_time"
          value-format="yyyy-MM-dd"
          type="daterange"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
        >
        </el-date-picker>
      </div>
      <el-select v-model="searchContent.stage" placeholder="操作阶段">
        <el-option
          v-for="item in stageList"
          :key="item.name"
          :label="item.value"
          :value="item.name"
        >
        </el-option>
      </el-select>
      <div class="putaway-time-wrapper">
        <span class="member_name-label">操作店铺：</span>
        <el-input
          class="search-content-input"
          v-model="searchContent.store_name"
          placeholder="请输入操作店铺"
        ></el-input>
      </div>
      <div class="putaway-time-wrapper">
        <span class="member_name-label">管理员名称：</span>
        <el-input
          class="search-content-input"
          v-model="searchContent.aname"
          placeholder="请输入管理员名称"
        ></el-input>
      </div>
      <div class="putaway-time-wrapper">
        <span class="member_name-label">描述：</span>
        <el-input
          class="search-content-input"
          v-model="searchContent.description"
          placeholder="请输入描述"
        ></el-input>
      </div>
      <div class="putaway-time-wrapper">
        <span class="member_name-label">手机：</span>
        <el-input
          class="search-content-input"
          v-model="searchContent.pl_mobile"
          placeholder="请输入手机"
        ></el-input>
      </div>
      <div class="putaway-time-wrapper">
        <el-input
          class="search-content-input"
          v-model="searchContent.pl_operate_name"
          placeholder="请输入操作人"
        ></el-input>
      </div>
      <div class="putaway-time-wrapper">
        <el-input
          class="search-content-input"
          v-model="searchContent.pl_review_name"
          placeholder="请输入审核人"
        ></el-input>
      </div>
      <div class="putaway-time-wrapper">
        <el-select
          class="search-content-input"
          v-model="searchContent.pl_review"
          placeholder="请选择审核状态"
        >
          <el-option value="1" label="已审核">已审核</el-option>
          <el-option value="0" label="未审核">未审核</el-option>
        </el-select>
      </div>
      <el-button type="primary" @click="search">搜索</el-button>
      <el-button type="primary" @click="resetSearchData">重置</el-button>
    </div>
    <div class="search-list">
      <el-table :data="pointsList" border :height="oHeight">
        <el-table-column align="center" type="selection" width="55">
        </el-table-column>
        <el-table-column
          align="center"
          prop="pl_id"
          label="序号"
          min-width="120"
        ></el-table-column>
        <el-table-column
          align="center"
          prop="pl_membername"
          label="会员名称"
          min-width="120"
        ></el-table-column>
        <el-table-column
          align="center"
          prop="pl_adminname"
          label="管理员名称"
          min-width="120"
        ></el-table-column>
        <el-table-column
          align="center"
          prop="pl_points"
          label="元宝值"
          min-width="120"
        ></el-table-column>
        <el-table-column
          align="center"
          prop="pl_addtime"
          label="添加时间"
          min-width="120"
        >
        </el-table-column>
        <el-table-column
          align="center"
          prop="stage_name"
          label="操作阶段"
          min-width="120"
        ></el-table-column>
        <el-table-column
          align="center"
          prop="pl_desc"
          label="描述"
          min-width="120"
        >
        </el-table-column>
        <el-table-column
          align="center"
          prop="pl_operate_name"
          label="操作人"
          min-width="120"
        >
        </el-table-column>
        <el-table-column
          align="center"
          prop="pl_operate_time"
          label="操作时间"
          min-width="120"
        >
          <template slot-scope="scope">
            <span v-if="scope.row.pl_operate_time">
              {{(scope.row.pl_operate_time * 1000) | dateFormatter("YYYY-MM-DD ")}}
            </span>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="pl_review_name"
          label="审核人"
          min-width="120"
        >
        </el-table-column>
        <el-table-column align="center" label="审核时间" min-width="120">
          <template slot-scope="scope">
            <span v-if="scope.row.pl_review_time">{{
              (scope.row.pl_review_time * 1000) | dateFormatter("YYYY-MM-DD ")
            }}</span>
          </template>
        </el-table-column>
        <el-table-column align="center" label="审核状态" min-width="120">
          <template slot-scope="scope"
            ><span>{{
              scope.row.pl_review == 0 ? "未审核" : "已审核"
            }}</span></template
          >
        </el-table-column>
        <el-table-column
          align="center"
          prop="store_name"
          label="操作店铺"
          min-width="120"
        >
        </el-table-column>
      </el-table>
      <div class="bottom flex-item">
        <div class="btn-group">
          <el-button
            size="mini"
            type="primary"
            class="btn-bottom"
            @click="exportData">
            导出
          </el-button>
        </div>
        <!--分页部分-->
        <div class="paginationOne">
          <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="searchContent.page"
            :page-sizes="[10, 20, 50, 100]"
            :page-size="searchContent.pageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="total"
          >
          </el-pagination>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import { resize } from "@/common/js/height.js";
import { dateFormatter } from "../../../../common/js/util";
export default {
  data() {
    return {
      pointsList: [],
      oHeight: 800,
      searchContent: {
        pageSize: localStorage.getItem("pageSize") * 1 || 20,
        page: 1,
        description: "",
        pl_mobile: "",
        end_time: "",
        start_time: "",
        stage: "",
        store_name: "",
        aname: "",
        mname: "",
        arrive_time: "",
        pl_operate_name: "",
        pl_review_name: "",
        pl_review: "",
      },
      arrive_time: "",
      stageList: [],
      searchObj: {},
      total: 0
    };
  },
  created() {
    this.getList();
    this.getStageName();
  },
  methods: {
    reset_headers_params(row) {
      // this.parameterForm
      // {username:dsx,passwd:123}-----输入类型
      // [{name:"username",value:"dsx"},{name:'passwd',value:'123'}]   ---输出类型
      if (row) {
        var params_data = [];
        var parameterObj = row;
        for (var num in parameterObj) {
          var params = {};
          params["name"] = num;
          params["value"] = parameterObj[num]; //组装成对象
          params_data.push(params); //添加到数组
        }
        this.parameterForm = params_data; //初始化到parameterForm
        return params_data;
      } else {
        this.form.params = undefined;
        this.form.headers = undefined;
      }
    },
    showFn(data) {
      this.$refs.ceshi.show_dialog_fn(data);
    },
		exportData() {
			const origin = this.$store.state.location.origin
      const datas = { ...this.searchObj }
      const params = [], dataList = Object.entries(datas)
      if (dataList.length <= 2) {
        return this.$message.error('请先搜索再导出')
      } else if (this.total > 10000) {
        return this.$message.error('数据超10000条，禁止导出。请设置详细搜索条件')
      }
      dataList.forEach(item => {
          if (item[1] || item[1] === 0) {
              params.push(`${item[0]}=${item[1]}`)
          }
      })
			window.location.href = origin + "/admin/member/index.php?act=pointManage&op=list&is_export=1&"+ params.join("&")
		},
    handleSizeChange(pageSize) {
      localStorage.setItem("pageSize", pageSize);
      this.searchContent.pageSize = pageSize;
      this.searchContent.page = 1;
      this.getList();
    },
    handleCurrentChange(page) {
      this.searchContent.page = page;
      this.getList();
    },
    // 重置
    resetSearchData() {
      this.searchContent = {
        page: 1,
        pageSize: localStorage.getItem("pageSize") * 1 || 10,
      };
    },
    // 搜索
    search() {
      this.searchContent.page = 1;
      if (this.searchContent.arrive_time) {
        this.searchContent.end_time = dateFormatter(
          "YYYY-MM-DD 23:59:59",
          this.searchContent.arrive_time[1]
        );
        this.searchContent.start_time = dateFormatter(
          "YYYY-MM-DD 00:00:00",
          this.searchContent.arrive_time[0]
        );
      }
      this.searchObj = {
        description: this.searchContent.description,
        pl_mobile: this.searchContent.pl_mobile,
        end_time: this.searchContent.end_time,
        start_time: this.searchContent.start_time,
        stage: this.searchContent.stage,
        store_name: this.searchContent.store_name,
        aname: this.searchContent.aname,
        mname: this.searchContent.mname,
        pl_operate_name: this.searchContent.pl_operate_name,
        pl_review_name: this.searchContent.pl_review_name,
        pl_review: this.searchContent.pl_review,
      };
      this.getList();
    },
    getStageName() {
      this.$http
        .post("/admin/member/index.php?act=pointManage&op=getStageSelect", "")
        .then((res) => {
          if (res.code == 1) {
            if (res.data) {
              this.stageList = this.reset_headers_params(res.data);
              // console.log(this.stageList);
            }
          }
        });
    },
    // 获取列表
    getList() {
      var data = this.searchObj;
      data.page = this.searchContent.page;
      data.pageSize = this.searchContent.pageSize;
      // console.log(data);
      this.$http
        .post("/admin/member/index.php?act=pointManage&op=list", data)
        .then((res) => {
          if (res.code == 1) {
            this.pointsList = res.data?.list || [];
            this.total = +res.data?.totalCount || 0;
          } else if (res.code == 2001) {
            this.pointsList = [];
            this.total = 0;
          } else {
            alert(res.msg);
          }
        });
    }
  },
  mounted() {
    resize(this);
  },
};
</script>
<style lang="scss" scoped>
.on-sale-good-car {
  .search-content {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    padding-left: 0;
    &-input {
      width: 200px;
    }
    .putaway-time-wrapper {
      display: flex;
      align-items: center;
      /deep/.el-range-separator {
        box-sizing: content-box;
      }
    }
    .member_name-label {
      font-size: 14px;
      margin-left: 8px;
      color: #333;
    }
  }
}
</style>